import 'package:flutter/cupertino.dart';
import 'package:imember/Util/Global.dart';
import 'package:imember/Util/MyColor.dart';
import 'package:imember/Util/PageUtil.dart';
import 'package:imember/Widget/MyButton.dart';
import 'package:imember/Widget/MyDialog.dart';
import 'package:imember/Widget/MyImage.dart';
import 'package:imember/Widget/MyInput.dart';

class OrderDetail extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _OrderDetail();
  }
}

class _OrderDetail extends State {
  @override
  Widget build(BuildContext context) {
    return Container(
        color: MyColor.White,
        width: 750,
        child: Column(mainAxisSize: MainAxisSize.min, children: [
          Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
            LocalImage("ic_back_g.png", width: 48, onTap: () {
              PageUtil().back(context);
            }),
            Text("明細", style: TextStyle(fontSize: 20, color: MyColor.C51)),
            Container(width: 48)
          ]),
          Container(height: 1, color: MyColor.C4),
          Container(height: 16),
          Row(children: [
            Expanded(child: Info("訂單編號", "123")),
            Expanded(child: Info("發票號碼", "2134")),
          ]),
          Container(height: 16),
          Row(children: [
            Expanded(child: Info("訂單時間", "2020/12/23 14:43")),
            Expanded(child: Info("邀請碼　", "TZ-00125")),
          ]),
          Container(height: 16),
          Info("訂單狀態", "已出貨  2020/12/23 14:43", width: 304),
          Container(height: 16),
          Row(mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [
            Container(width: 24),
            Text("訂單內容", style: TextStyle(fontSize: 20, color: MyColor.C51)),
            Container(
                width: 553,
                height: 300,
                alignment: Alignment.centerLeft,
                margin: EdgeInsets.only(left: 12),
                padding: EdgeInsets.fromLTRB(15, 8, 15, 15),
                decoration: Global.getBoxBg(6, MyColor.F5),
                child: Column(children: [
                  Text("消費明細", style: TextStyle(fontSize: 20, color: MyColor.C51)),
                  Expanded(
                      child: ListView.builder(
                          padding: EdgeInsets.all(0),
                          shrinkWrap: true,
                          itemCount: 2,
                          itemBuilder: (BuildContext context, int index) {
                            return Container(
                                padding: EdgeInsets.fromLTRB(0, 4, 48, 4),
                                child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
                                  Text("衛生紙X1", style: TextStyle(fontSize: 15, color: MyColor.C51)),
                                  Text("\$99", style: TextStyle(fontSize: 15, color: MyColor.C51)),
                                ]));
                          })),
                  Container(height: 1, color: MyColor.C4),
                  Container(
                      width: double.infinity,
                      padding: EdgeInsets.fromLTRB(0, 4, 48, 4),
                      child: Column(crossAxisAlignment: CrossAxisAlignment.end, children: [
                        Text("小計\$99", style: TextStyle(fontSize: 15, color: MyColor.Orange, height: 1.5)),
                        Text("折扣\$99", style: TextStyle(fontSize: 15, color: MyColor.Orange, height: 1.5)),
                        Text("總計\$99", style: TextStyle(fontSize: 17, color: MyColor.Orange, height: 1.5)),
                      ])),
                  Container(width: double.infinity, child: Text("備註 送到金門機場", style: TextStyle(fontSize: 13, color: MyColor.C51))),
                ]))
          ]),
          Container(
              width: 553,
              margin: EdgeInsets.only(left: 40, top: 12, bottom: 50),
              child: Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [
                BlueBtn("補印發票", width: 170, height: 37),
                BlueBtn("補印明細", width: 170, height: 37),
                OrangeBtn("取消訂單", width: 170, height: 37, onTap: () {
                  showBtn2Dialog(context, "是否取消訂單", "取消", () {}, "確認", () {});
                }),
              ]))
        ]));
  }
}

class Info extends StatelessWidget {
  String title;
  String value;
  double? width;

  Info(this.title, this.value, {this.width});

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Container(width: 24),
        Text(title, style: TextStyle(fontSize: 20, color: MyColor.C51)),
        Container(
            height: 37,
            width: width ?? 210,
            alignment: Alignment.centerLeft,
            margin: EdgeInsets.only(left: 12),
            padding: EdgeInsets.fromLTRB(15, 0, 15, 0),
            decoration: Global.getBoxBg(20, MyColor.F5),
            child: Text(value, style: TextStyle(fontSize: 17, color: MyColor.C51)))
      ],
    );
  }
}
